﻿@{
    ViewBag.Title = "Form";
    Layout = "~/Views/Shared/_Form.cshtml";
}

<form id="form1">
    <div style="padding-top: 20px; margin-right: 20px;">
        <table class="form">
            <tr>
                <th class="formTitle">关联空间</th>
                <td class="formValue">
                    <select id="F_SpaceId" name="" class="form-control required">
                        <option value="">==请选择关联空间==</option>
                    </select>
                </td>
            </tr>
            <tr>
                <th class="formTitle">资讯类型</th>
                <td class="formValue">
                    <select id="F_Types" name="" class="form-control required">
                        <option value="">==请选择资讯类型==</option>
                    </select>
                </td>
            </tr>
            <tr>
                <th class="formTitle">所属栏目</th>
                <td class="formValue">
                    <select id="F_Class" name="" class="form-control required"></select>
                </td>
            </tr>
            <tr>
                <th class="formTitle">资讯来源</th>
                <td class="formValue">
                    <select id="F_Source" name="" class="form-control required">
                        <option value="">==请选择资讯来源==</option>
                    </select>
                </td>
            </tr>
            <tr>
                <th class="formTitle">资讯标题</th>
                <td class="formValue">
                    <input id="F_Title" name="F_Title" type="text" class="form-control required" placeholder="资讯标题" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">摘要</th>
                <td class="formValue">
                    <textarea rows="3" id="F_Abstract" name="F_Note" class="form-control" placeholder="摘要" style="width: 99%;"></textarea>
                </td>
            </tr>
            <tr>
                <th class="formTitle">资讯首图地址</th>
                <td class="formValue image">
                    <input id="F_ImageSrc" name="F_ImageSrc" type="hidden" />
                    <img id="F_ImageSrc_Preview" style="width: 140px; height: 140px;" src="" alt="显示图" class="img-rounded">
                    <p>
                        <button type="button" class="btn btn-info btn-xs" onclick="uploader()">上传．．．</button>
                    </p>
                </td>
            </tr>

            <tr>
                <th class="formTitle">资讯显示时间</th>
                <td class="formValue">
                    <input type="text" id="F_Time" name="F_ActivityEndDate" class="form-control input-wdatepicker required" onfocus="WdatePicker()" placeholder="资讯显示时间" style="width: 150px" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">是否首页推荐</th>
                <td class="formValue">
                    <input type="checkbox" id="F_HomeRecommenda" name="F_HomeRecommenda" class=" " value="1" placeholder="是否首页推荐" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">首页推荐时间</th>
                <td class="formValue">
                    <input type="text" id="F_HomeRecTime" name="F_ActivityEndDate" class="form-control input-wdatepicker required" onfocus="WdatePicker()" placeholder="首页推荐时间" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">浏览次数</th>
                <td class="formValue">
                    <input type="number" id="F_Viewed" name="F_BuildDate" class="form-control" placeholder="浏览次数" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">点赞次数</th>
                <td class="formValue">
                    <input type="number" id="F_UpNumber" name="" class="form-control number" placeholder="点赞次数" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">搜索关键字</th>
                <td class="formValue">
                    <select id="F_Keyword" name="F_Keyword" class="form-control select2-container select2-container--default select2-container--open"></select>
                </td>
            </tr>
            <tr>
                <th class="formTitle">审核状态</th>
                <td class="formValue">
                    <select id="F_State" name="auditStates" class="form-control select2-container select2-container--default select2-container--open">
                        <option value="">==请选择审核状态==</option>
                    </select>
                </td>
            </tr>
            <tr>
                <th class="formTitle">是否热门推荐</th>
                <td class="formValue">
                    <input type="checkbox" id="F_Hot" name="F_PersionNumber" class="" placeholder="是否热门推荐" value="1" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">热门推荐时间</th>
                <td class="formValue">
                    <input type="text" style="width: 150px" id="F_HotRecTime" name="F_ActivityEndDate" class="form-control input-wdatepicker required" onfocus="WdatePicker()" placeholder="热门推荐时间" />
                </td>
            </tr>
            <tr>
                <th class="formTitle">推荐城市</th>
                <td class="formValue">
                    <select id="F_RecCity" name="F_ActivityType" class="form-control select2-container select2-container--default select2-container--open"></select>
                </td>
            </tr>
            <tr>
                <th class="formTitle">是否专题</th>
                <td class="formValue">
                    <input type="checkbox" id="F_IsSpecial" name="" class="required" placeholder="是否专题" value="1" />

                </td>
            </tr>
            <tr>
                <th class="formTitle">资讯内容</th>
                <td class="formValue">
                    @* <textarea rows="3" id="F_Details" name="F_Note" class="form-control" placeholder="" style="width:99%;"></textarea>*@
                    <script id="F_Details" name="F_Details" type="text/plain" style="width: 100%; height: 350px;">
                    </script>
                </td>
            </tr>
        </table>
    </div>
</form>

<script type="text/javascript" charset="utf-8" src="~/Content/js/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="~/Content/js/ueditor/ueditor.all.min.js"></script>
<!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
<script type="text/javascript" charset="utf-8" src="~/Content/js/ueditor/lang/zh-cn/zh-cn.js"></script>

<script>
    var dictionaryData;
    var keyValue = $.request("keyValue");
    var mark = $.request("mark");
    var editor;

    $(function () {
        initData();

        //$("#F_Class").bindSelect({
        //    url: "/ClientManager/ClientInfos/GetAllCitys",
        //    search: true,
        //    id: "F_EnCode",
        //    text: "F_FullName"
        //});

    });

    //初始化控件
    function initControl() {
        editor = UE.getEditor('F_Details');

        if (mark == 'detail') {
            $('.form-control').prop('disabled', true);
        }

        //$("#F_ImageSrc_Preview").attr("src", data.F_ImageSrc + '-400x267');

        $("#F_Class,#F_RecCity,#F_Keyword").bindSelect({
            placeholder: "请选择相关内容",
            multiple: true
        });

        $("#F_Source").select2();
        //var $multipleSelectControls = $("#F_Source");

        //$multipleSelectControls.bindSelect({
        //    placeholder: "请选择相关内容",
        //    multiple: true
        //});

        var spaces = dictionaryData.spaces;
        for (var i = 0; i < spaces.length; i++) {
            $("#F_SpaceId").append("<option value='" + spaces[i].Key + "'>" + spaces[i].Value + "</option>");
        }

        //var articleTypes = dictionaryData.articleTypes;
        //for (var i = 0; i < articleTypes.length; i++) {
        //    $("#articleTypes").append("<option value='" + articleTypes[i].F_Id + "'>" + articleTypes[i].F_ItemName + "</option>");
        //}
        $("#F_Types").bindSelect({
            url: "/Topic/Article/GetIndexArticleTypesTreeSelectJson",
            id: "extend"
        });

        var banners = dictionaryData.banners;
        for (var i = 0; i < banners.length; i++) {
            $("#F_Class").append("<option value='" + banners[i].F_ItemCode + "'>" + banners[i].F_ItemName + "</option>");
        }

        var sources = dictionaryData.sources;
        for (var i = 0; i < sources.length; i++) {
            $("#F_Source").append("<option value='" + sources[i].F_ItemCode + "'>" + sources[i].F_ItemName + "</option>");
        }

        var auditStates = dictionaryData.auditStates;
        for (var i = 0; i < auditStates.length; i++) {
            $("#F_State").append("<option value='" + auditStates[i].F_ItemCode + "'>" + auditStates[i].F_ItemName + "</option>");
        }

        var keywords = dictionaryData.keywords;
        for (var i = 0; i < keywords.length; i++) {
            $("#F_Keyword").append("<option value='" + keywords[i].F_ItemCode + "'>" + keywords[i].F_ItemName + "</option>");
        }

        $("#F_RecCity").bindSelect({
            url: "/ClientManager/ClientInfos/GetAllCitys",
            search: true,
            id: "F_EnCode",
            text: "F_FullName",
            multiple: true
        });

        $("#F_SpaceId").select2({ multiple: false });
    }

    //初始化字典数据
    function initDictionryData() {
        $.ajax({
            url: "/Topic/Article/GetIndexItemsJson",
            dataType: "json",
            async: false,
            success: function (data) {
                dictionaryData = data;
            }
        });
    }

    //初始化数据
    function initData() {
        initDictionryData();
        initControl();

        if (mark == 'add') {
            return;
        }

        if (keyValue) {
            $.ajax({
                url: "/Topic/Article/GetArticleFormJson?keyValue=" + keyValue,
                dataType: "json",
                async: false,
                success: function (data) {
                    console.log(data);
                    if (data) {
                        $('#F_Title').val(data.F_Title);
                        $('#F_Abstract').val(data.F_Abstract);
                        $('#F_ImageSrc_Preview').attr('src', data.F_FirstPicture);
                        $('#F_Time').val(data.F_Time);
                        $('#F_HomeRecTime').val(data.F_HomeRecTime);
                        $('#F_Viewed').val(data.F_Viewed);
                        $('#F_UpNumber').val(data.F_UpNumber);
                        $('#F_State').val(data.F_State);
                        $('#F_IsSpecial').val(data.F_IsSpecial);
                        $('#F_HotRecTime').val(data.F_HotRecTime);
                        $('#F_Details').val(data.F_Details);
                        
                        if (data.F_Hot == "1") {
                            $('#F_Hot').prop("checked", true);
                        }

                        if (data.F_HomeRecommenda == "1") {
                            $('#F_HomeRecommenda').prop("checked", true);
                        }

                        $('#F_Types').val(data.F_Types).trigger('change');
                        $('#F_SpaceId').val(data.F_SpaceId).trigger('change');
                        $('#F_Source').val(data.F_Source).trigger('change');
                        $('#F_RecCity').val(data.F_RecCity.split(',')).trigger('change');
                        $("#F_Class").val(data.F_Class.split(',')).trigger('change');
                        $("#F_Keyword").val(data.F_Keyword.split(',')).trigger('change');
                    }
                }
            });
        }
    }

    function uploader() {
        $.modalOpen({
            id: "ArticleUploader",
            title: "添加图片",
            url: "/Topic/Article/ShowUploader",
            width: "600px",
            height: "230px",
            callBack: function (iframeId) {
                top.frames[iframeId].submitForm();
            }
        });
    }

    function settingImage(imageSrc) {
        $("#F_ImageSrc").val(imageSrc);
        if (imageSrc) {
            $("#F_ImageSrc_Preview").attr("src", imageSrc + '-400x267');
        }
    }

    function submitForm() {
        if ($('#F_Class').val() == undefined) {
            return;
        }

        if ($('#F_Types').val() == "0") {
            return;
        }

        //if (!$('#form1').formValid()) {
        //    return false;
        //}
        //var serialize = $("#form1").formSerialize();
        //var params = $.extend({ F_State: $("#F_State1").prop("checked") }, serialize);
        //console.dir(params);
        //$.submitForm({
        //    url: "/Topic/Article/SubmitForm2?keyValue=" + keyValue,
        //    param: params,
        //    success: function () {
        //        $.currentWindow().$("#gridList").trigger("reloadGrid");
        //    }
        //});

        $.submitForm({
            url: "/Topic/Article/SubmitForm?keyValue=" + keyValue,
            param: {
                'F_Types': $('#F_Types').val(),
                'F_Class': $('#F_Class').val().join(','),
                'F_SpaceId': $('#F_SpaceId').val(),
                'F_Source': $('#F_Source').val(),
                'F_Title': $('#F_Title').val(),
                'F_Abstract': $('#F_Abstract').val(),
                'F_FirstPicture': $('#F_ImageSrc').val(),
                'F_Time': $('#F_Time').val(),
                'F_HomeRecommenda': $('#F_HomeRecommenda').val(),
                'F_HomeRecTime': $('#F_HomeRecTime').val(),
                'F_Viewed': $('#F_Viewed').val(),
                'F_UpNumber': $('#F_UpNumber').val(),
                'F_State': $('#F_State').val(),
                'F_Hot': $('#F_Hot').val(),
                'F_HotRecTime': $('#F_HotRecTime').val(),
                'F_Details': editor.getContent(),
                'F_RecCity': $('#F_RecCity').val(),
                'F_IsSpecial': $('#F_IsSpecial').val(),
                'F_Keyword': $('#F_Keyword').val().join(',')
            },
            success: function (result) {

                $.currentWindow().$("#gridList").trigger("reloadGrid");
            },
            close: true
        });
    }
</script>